﻿var path = this.path;
define([this.path + './../4.x/plugins/esri/layers/DivGraphicsLayer.js'], function(GraphicsLayer) {
    var CantonStatisticsLayer = GraphicsLayer.createSubclass({
        setData: function(mapView, layer) {
            var me = this;
            me.imageUrl = path + './../../one-map/1.0.0/src/mode/arcgis/css/images/square.svg';
            var options = layer.layer || {};
            me.mapView = mapView;
            let mapUtils = me.mapUtils = mapView.mapUtils;
            me.options = options;
            me.layer = layer.layer;
            me.spatialReference = mapView.getSpatialReference()


            this.fieldArray = options.fieldArray || [{
                key: 'name',
                style: 'font-weight: bold;white-space: nowrap;overflow: hidden;text-overflow: ellipsis;'
            }, { key: 'count', style: '' }];
            this.cantonLevelDictionary = options.cantonLevelDictionary || {
                1: { min: 0, max: 4617150 }, //国
                2: { min: 4617150, max: 2308575 }, //省
                3: { min: 2308575, max: 577144 }, //市
                4: { min: 577144, max: 144286 }, //区县
                5: { min: 144286, max: 72143 }, //乡镇
                6: { min: 72143, max: 0 } //村
            };
            var symbol = options.symbol || {};
            this.style = mapUtils.$.extend({
                width: '60px',
                height: '60px',
                color: '#fff',
                display: 'flex',
                'background-color': '#2d8cf0',
                'border-radius': '50%',
                'flex-direction': 'column',
                'justify-content': 'center',
                'text-align': 'center'
            }, symbol.style);
            this.style = mapUtils.objectToString(this.style);
            this.class = symbol.class;
            this.lngFieldName = options.lngFieldName;
            this.latFieldName = options.latFieldName;
            this.cantonCodeFieldName = options.cantonCodeFieldName;
            this.parentCantonCodeFieldName = options.parentCantonCodeFieldName;
            this.cantonLevelFieldName = options.cantonLevelFieldName;
            this.clickCallback = options.clickCallback;
            this.currentScale = this.mapUtils.getScale(this.mapView);

            if (!this._element) {
                return;
            };
            var lngLatArray = mapUtils.toLngLatArray(mapView, options.data, options);
            this.data = lngLatArray;
            this._setData(this.data)
        },
        _setData: function(lngLatArray) {
            var me = this;
            lngLatArray.map((item, index) => {
                this.setHtml(item);
                let isAdd = this.isAddByScale(item);
                if (isAdd) {
                    this.createGraphic(item);
                }
                if (index == lngLatArray.length - 1) {
                    if (typeof me.options.callback == 'function') {
                        me.options.callback(me.layer);
                    };
                };
            });
        },
        setHtml: function(item) {
            if (item.symbol && item.symbol.style) {
                item.symbol.style = mapUtils.$.extend({
                    width: '60px',
                    height: '60px',
                    color: '#fff',
                    display: 'flex',
                    'background-color': '#2d8cf0',
                    'border-radius': '50%',
                    'flex-direction': 'column',
                    'justify-content': 'center',
                    'text-align': 'center'
                }, item.symbol.style);
                item.symbol.style = mapUtils.objectToString(item.symbol.style);
            }
            if (!item.html) {
                item.html = `<div class="${(item.symbol && item.symbol.class) || this.class}" style="${(item.symbol && item.symbol.style) || this.style}">`
                if (item.symbol && item.symbol.html) {
                    item.html += item.symbol.html;
                } else if (this.fieldArray && this.fieldArray.length > 0) {
                    this.fieldArray.map(function(entity) {
                        var value = item[entity.key];
                        var style = entity.style || '';
                        if (value || value == 0) {
                            item.html += `<div style="${style}">${value}</div>`
                        }
                    })
                }
                item.html += '</div>';
            };
        },
        isAddByScale: function(item) {
            var isAdd = false;
            var cantonCode = this.parentCantonCode || '';
            var cantonLevelObj = this.cantonLevelDictionary[item[this.cantonLevelFieldName]];
            if (cantonLevelObj) {
                var mapScale = this.currentScale = this.mapUtils.getScale(this.mapView);

                function filterMapScale(cantonLevelObj) {
                    if (cantonLevelObj.min && cantonLevelObj.max) {
                        if (cantonLevelObj.min > mapScale && cantonLevelObj.max <= mapScale) {
                            isAdd = true;
                        }
                    } else if (cantonLevelObj.min) {
                        if (cantonLevelObj.min > mapScale) {
                            isAdd = true;
                        }
                    } else if (cantonLevelObj.max) {
                        if (cantonLevelObj.max <= mapScale) {
                            isAdd = true;
                        }
                    }
                    return isAdd;
                }

                if (cantonCode && item[this.parentCantonCodeFieldName]) {
                    if (cantonCode == item[this.parentCantonCodeFieldName]) {
                        return filterMapScale(cantonLevelObj);
                    };
                } else {
                    return filterMapScale(cantonLevelObj);
                };
            }

        },
        createGraphic: function(item) {
            var me = this;
            var symbolFieldName = this.options.symbolFieldName || this.mapView.getSymbolFieldName();
            var point = me.mapUtils.createPoint(me.mapView, item);
            var symbol = item[symbolFieldName] || me.options.symbol || {};
            var divGraphic = me.mapUtils.createGraphic(me.mapView, {
                geometry: point,
                attributes: item,
                popupTemplate: null
            });

            me._setElement(divGraphic);
            var eleJQ = $(me._getElement(divGraphic));
            eleJQ.addClass(symbol.class).css(symbol.css || {}).html(item.html);
            me._draw(divGraphic);

            me.add(divGraphic);

            divGraphic.attributes = item;

            // me.setOffset(me.symbolOptions, eleJQ);

            // me.setCollision(divGraphic, me.options);


        },
        _refresh: function() {
            var mapScale = this.mapUtils.getScale(this.mapView);
            if (this.currentScale != mapScale) {
                this.clear();
                this._setData(this.data);
            }
            this.inherited(arguments);
        },
        getGraphicLocation: function(mapView, esriEvent) {
            if (!esriEvent || !esriEvent.graphic) {
                return;
            };
            if (!mapView) {
                return;
            };

            var geometry = esriEvent.graphic.geometry || {};
            var lngFieldName = mapView.getLngFieldName();
            var latFieldName = mapView.getLatFieldName();
            var location = {}
            location[lngFieldName] = geometry.x;
            location[latFieldName] = geometry.y;
            return location;
        },
        convertSr: function(mapView, lngLatArray, callback) {
            var me = this;
            if (!mapView) {
                return;
            };
            var mapUtils = mapView.mapUtils;
            var mapSr = mapView.getSpatialReference();
            me.mapSr = mapSr;
            var layerSr = me.spatialReference;
            if (mapSr == layerSr) {
                callback();
                return
            };
            /*坐标转换，扩展的图层不像svg可以自动转换坐标，如果点位的坐标与底图的坐标不一致需要先手工转换坐标*/
            if (mapSr.wkid == '102100') {
                if (layerSr.wkid == '4326' || layerSr.wkid == '4490') {
                    me.lngLatToXY(mapView, lngLatArray, function(lngLatArray) {
                        if ($.isFunction(callback)) {
                            callback(lngLatArray, mapSr);
                        };
                    });
                    return;
                };
            };
            if (mapSr.wkid == '4326' || mapSr.wkid == '4490') {
                if (layerSr.wkid == '102100') {
                    me.xyToLngLat(mapView, lngLatArray, function(lngLatArray) {
                        if ($.isFunction(callback)) {
                            callback(lngLatArray, mapSr);
                        };
                    });
                    return;
                };

            };
            if ($.isFunction(callback)) {
                callback(lngLatArray, me.spatialReference);
            };

        },
        lngLatToXY: function(mapView, lngLatArray, callback) {
            mapView.mapUtils.webMercatorUtils(mapView, lngLatArray, { isLngLat: true, callback: callback });
        },
        xyToLngLat: function(mapView, data, callback) {
            mapView.mapUtils.webMercatorUtils(mapView, lngLatArray, { isLngLat: false, callback: callback });
        }

    })
    return CantonStatisticsLayer;
});